<template>
	<!-- <view class="full-page" v-if="totalPage">
		
	</view> -->
	<view class="content" >
		<!-- <block v-if="noNetwork">
			<view class="display-flex" style="padding-top: 166px;justify-content: center;">
				<image src="/static/images/network.png" mode="aspectFit" style="width: 152px;height: 170px;"></image>
			</view>
		</block> -->
		<block>
			<!-- #ifndef MP-WEIXIN -->
			<u-navbar bgColor="#fff" :placeholder="true" :fixed="true" :style="{opacity: showLogin ? 0 : 1}">
				<view slot="left">
					<image :src="userInfo.pic | formatImgUrl" mode="aspectFill" style="width: 36px;height: 36px;border-radius: 50%;" @tap="clickAvatar"></image>
				</view>
				<view slot="center">
					<view class="serbox" @click="$go('/pages/find/search')" style="margin-bottom: 0;">
						<image :src="'/images/search.png' | formatImgUrl" class="serpic" mode=""></image>
						<input type="text" class="serput" disabled="true" placeholder="搜用户、橱窗、圈子、内容" style="width: 400rpx;">
					</view>
				</view>
				<view slot="right" style="position: relative;">
					<text class="display-flex" style="position: absolute;right: 5px;top: 5px;min-width: 8px;height: 8px;border-radius: 50%;background-color: #ED3232;font-size: 10px;color: #fff;justify-content: center;z-index: 1;" v-if="userInfo.xt_new"></text>
					<image :src="'/images/navicon-msg.png' | formatImgUrl" mode="aspectFit" style="width: 36px;height: 36px;" @tap="switchRoom"></image>
				</view>
			</u-navbar>
			<!-- #endif -->
			
			<!-- #ifdef MP-WEIXIN -->
			<view class="serbox" @click="$go('/pages/find/search')">
				<image :src="'/images/search.png' | formatImgUrl" class="serpic" mode=""></image>
				<input type="text" class="serput" disabled="true" placeholder="搜用户、橱窗、圈子、内容">
			</view>
			<!-- #endif -->
			
			<!-- <swiper class="swiper" :indicator-dots="true" :autoplay="true" :interval="4000" :duration="1000"
				:circular="true" indicator-active-color="#ffffff">
				<swiper-item v-for="(item,index) in indexData.banner" :key="index" class="swiperwra"
					@click="goPage(item.url)">
					<image class="imgass" :src="item.logo | formatImgUrl" mode="aspectFill"></image>
				</swiper-item>
			</swiper> -->
			
			<view class="new-img-box display-flex just-between">
				<view class="img img1" @tap="xieshou">
					<text class="txt1">快速约文</text>
					<text class="txt2">海量优质写手、需求精准匹配</text>
					<image :src="'/images/banner1-btn1.png' | formatImgUrl" mode="aspectFill" class="txt3" v-if="btn_status == 0"></image>
					<image :src="'/images/banner1-btn2.png' | formatImgUrl" mode="aspectFill" class="txt3" v-if="btn_status == 1"></image>
					<image :src="'/images/banner1-bg.png' | formatImgUrl" mode="aspectFill" class="s-bg"></image>
					<image :src="'/images/banner1-icon.png' | formatImgUrl" mode="aspectFill" class="s-icon"></image>
				</view>
				<view class="img img2" @tap="$go('/showcase/tip/tip')">
					<text class="txt1">标签匹配</text>
					<text class="txt2">海量写手、精准查找</text>
					<image :src="'/images/banner2-bg.png' | formatImgUrl" mode="aspectFill" class="s-bg"></image>
					<image :src="'/images/banner2-icon.png' | formatImgUrl" mode="aspectFill" class="s-icon"></image>
				</view>
				
				<!-- <image :src="'/images/banner1.png' | formatImgUrl" mode="aspectFill" class="img1" @tap="xieshou"></image>
				<image :src="'/images/banner2.png' | formatImgUrl" mode="aspectFill" class="img2" @tap="$go('/showcase/tip/tip')"></image> -->
			</view>
			
			<!-- 首页tip -->
			<view class="home_tip">
				<view class="tip">
					<image class="tip_img" :src="'/images/home_tip.png' | formatImgUrl" alt="" srcset="">
						权威保障
				</view>
				<view class="text">
					平台无虚假内容·交易信息真实可信
				</view>
			</view>
			
			<!-- 快捷功能区 -->
			<view class="quick-new display-flex">
				<view class="quick-new-item" v-for="(i,index) in wrapList" :key="index" @click="navTap2(i.id)">
					<image :src="i.iconhome | formatImgUrl" alt=""></image>
					<view class="">
						{{i.tit}}
					</view>
				</view>
			</view>
			
			<!-- <view class="quick_list">
				<view class="item" v-for="(i,index) in quickList" :key="index" @click="handleClick(i)">
					<image :src="i.url | formatImgUrl" alt="" srcset="">
						</image>
					<view class="item-bg"></view>
					<text class="title">{{i.title}}</text>
					<text class="info">{{i.tips}}</text>
				</view>
			
			</view> -->
			
			<!-- 正在制作 -->
			<view class="make_slider">
				<view class="header">
					<view class="title">
						猜你需要
					</view>
					<view class="more display-flex" @tap="viewId='view0',getShowcase()">
						<image :src="'/images/change.png' | formatImgUrl" alt="" mode="aspectFill">
						刷新推荐
					</view>
				</view>
				
				<scroll-view scroll-x="true"  :scroll-into-view="viewId" @scroll="viewId=''">
					<view class="guess_warp display-flex">
						<view class="item" :id="'view' + index" v-for="(item,index) in guessList" :key="index" @tap="$go('/showcase/showcase/datails?id=' + item.id+'&type=0')"  v-if="item.type_name !='其他'">
							<view class="top-img">
								<image :src="item.imagrs_arr[0] | formatImgUrl" alt="" mode="aspectFill">
								<view class="">
									<text>已完成{{item.buy_num}}次约文</text>
								</view>
							</view>
							<view class="tit">
								{{item.title}}
							</view>
							<view class="desc">
								写手主接“{{item.type_name}}”
							</view>
						</view>
					</view>
				</scroll-view>
			</view>
			
			<!-- <view class="pibox">
				<image :src="'/images/ia.png' | formatImgUrl" class="pipic" mode=""></image>
				<view class="picen">
					<view class="pititle">
						快速找到您想要的写手！
					</view>
					<view class="pitxt">
						{{config.vip_dispatch_status == '2'?'限时试用免费派单特权':'购买平台派单特权'}}，新脑洞立刻看
					</view>
				</view> -->
			<!-- <view class="piyou"
					@click="config.vip_dispatch_status == '1'?$go('/pages/index/mate'):paiKefu()">
					写手匹配
				</view> -->
			<!-- <view class="piyou" @click="xieshou()">
					写手匹配
				</view>
			</view> -->
			
			<view class="tuibox">
				<view class="tuititle">
					推荐写手
				</view>
				<view class="more display-flex" @tap="viewId2='view20',getWriterList()">
					<image :src="'/images/change.png' | formatImgUrl" alt="" mode="aspectFill">
					刷新写手
				</view>
			</view>
			
			<scroll-view scroll-x="true" class="writer_warp" :scroll-into-view="viewId2" @scroll="viewId2=''">
				<view class="display-flex" v-for="(items,indexs) in writerList" :key="indexs" :id="'view2' + indexs">
					<view class="item display-flex" v-for="(item,index) in items" :key="index"  @click="$go('/pages/my/my?id='+item.membe_id)">
						<image :src="item.pic | formatImgUrl" alt="" mode="aspectFill">
						<view class="">
							<view class="tit">
								{{item.username}}
							</view>
							<view class="desc">
								<text>{{Number(item.price).toFixed(0)}}</text>币/{{item.word_count}}
							</view>
						</view>
					</view>
					
				</view>
			</scroll-view>
			
			<view class="tuibox" style="margin-top: 10px;">
				<view class="tuititle display-flex">
					热门橱窗
					
					<view class="more display-flex" @tap="changeMode" style="margin-left: 9px;">
						<image :src="'/images/style.png' | formatImgUrl" alt="" mode="aspectFill" v-if="styleMode == 1">
						<image :src="'/images/style2.png' | formatImgUrl" alt="" mode="aspectFill" v-else>
						变更样式
					</view>
				</view>
				<view class="more display-flex" @tap="page=1,getMakeList()">
					<image :src="'/images/change.png' | formatImgUrl" alt="" mode="aspectFill">
					刷新推荐
				</view>
			</view>
			
			<!-- 橱窗样式一 -->
			<view class="show-wrap" v-if="styleMode == 1">
				<view class="item" v-for="(ite,idx) in hotList" :key="idx" @tap="$go('/showcase/showcase/datails?id=' + ite.id+'&type=0')" v-if="ite.type_name !='其他'">
					<view class="tit display-flex">
						<text class="txt1">{{ite.title}}</text>
						<text class="tag">{{ite.type_name}}</text>
					</view>
					<view class="desc">
						{{ite.desc}}
					</view>
					<view class="bottom display-flex just-between">
						<view class="stars display-flex">
							<image :src="'/images/star-full.png' | formatImgUrl" alt="" mode="aspectFit" v-for="(it,ix) in ite.rank" :key="ix">
								<image :src="'/images/star-half.png' | formatImgUrl" alt="" mode="aspectFit" v-for="(it,ix) in 5- ite.rank" :key="ix">
							<text>{{Number(ite.rank).toFixed(1)}}</text>
						</view>
						<view class="display-flex">
							<text class="count">{{ite.start_shooting}}单起拍</text>
							<text class="price">{{Number(ite.price).toFixed(0)}}币/{{ite.word_count}}</text>
						</view>
					</view>
					
					<view class="pics display-flex">
						<image :src="it | formatImgUrl" alt="" mode="aspectFill" v-for="(it,ix) in ite.imagrs_arr" :key="ix">
					</view>
				</view>
			</view>
			<!-- 橱窗样式二 -->
			<view class="show-wrap2 display-flex" v-if="styleMode == 2">
				<view class="item" v-for="(ite,idx) in hotList" :key="idx" @tap="$go('/showcase/showcase/datails?id=' + ite.id+'&type=0')" v-if="ite.type_name !='其他'">
					<view class="tit">
						{{ite.title}}
					</view>
					<view class="desc">
						{{ite.desc}}
					</view>
					<view class="infos">
						<text class="count">{{ite.start_shooting}}单起拍</text>
						<text class="price">{{Number(ite.price).toFixed(0)}}币/{{ite.word_count}}</text>
					</view>
					<view class="display-flex just-between">
						<text class="tag">{{ite.type_name}}</text>
						
						<view class="stars display-flex">
							<image :src="'/images/star-full.png' | formatImgUrl" alt="" mode="aspectFit" v-for="(it,ix) in ite.rank" :key="ix">
							<image :src="'/images/star-half.png' | formatImgUrl" alt="" mode="aspectFit" v-for="(it,ix) in 5- ite.rank" :key="ix">
							<text>{{Number(ite.rank).toFixed(1)}}</text>
						</view>
					</view>
				</view>
			</view>
		</block>
		
		

		<u-popup :show="show" mode="bottom" :overlayStyle="{'touch-action':'none'}" @close="close" @open="open">
			<view class="mask">
				<view class="matop" style="height: 700rpx;overflow-y: scroll; overscroll-behavior: none; ">
					<view class="matitle">
						— 请选择想要寻找的写手类型 —
					</view>
					<view class="bietxt">
						性别
					</view>
					<view class="gebox">
						<cc-multipleBtn :isSingleSel="false" :colors="colors" :remarkList="sexList"
							@tagClick="tagsClick2" :flag="1"></cc-multipleBtn>
						<!-- <view v-for="(item,index) in sexList" class="geli li72" :class="{'active': form.sex?item.id == form.sex:index == 0}"
							@click="navTap(item)">
							{{item.name}}
							<view class="line"></view>
						</view> -->
					</view>
					<view class="geetxt">
						价格区间
					</view>
					<view class="gebox">
						<input type="number" v-model="form.min_price" :always-embed="true" :adjust-position="true"
							placeholder="自定义最低价" cursor-spacing="40" class="geli">
						<input type="number" v-model="form.max_price" :always-embed="true" :adjust-position="true"
							placeholder="自定义最高价" cursor-spacing="40" class="geli">

						<!-- 	<cc-multipleBtn :isSingleSel="false" :colors="colors" :remarkList="priceList"
							           @tagClick="tagsClick3" :flag="1"></cc-multipleBtn> -->

					</view>
					<view class="geetxt">
						写手等级
					</view>
					<view class="dengbox">
						<cc-multipleBtn :isSingleSel="false" :colors="colors" :remarkList="denglist"
							@tagClick="tagsClick" :flag="0"></cc-multipleBtn>
					</view>

					<view class="geetxt">
						风格
					</view>
					<view class="dengbox">
						<cc-multipleBtn :isSingleSel="false" :colors="colors" :remarkList="fengge"
							@tagClick="tagsClick1" :flag="0"></cc-multipleBtn>
					</view>
				</view>

				<view class="madi">
					<view class="masub" @click="screen">
						确认筛选
					</view>
				</view>
			</view>
		</u-popup>
		
		
		<view class="mark_msg_bak" v-if="show_msg">
			<view class="mask_msg">
			
					<view class="deal-box">
						<view class="tit">
							隐私政策概要
						</view>
						<view class="conts">
					
							<p >dream约文（以下称“我们”）深知个人信息对您的重要性，并会全力保护您的个人信息安全。本概要旨在以简洁、清晰、易懂的方式向您介绍我们的隐私政策。如您需要了解更多内容，可点击查阅完整版
							<span @tap="yszc">《dream约文隐私政策》</span>
							。</p>
							<p >
								为了实现部分业务功能，需要开启您的设备权限：
								相册权限：用于您使用评论、分享、发帖、分享视频和图片等功能。
								相机权限：用于为您提供扫描二维码、拍摄照片、拍摄视频（包括直播）等相关功能。
								麦克风权限：用于您使用语音信息、语音交互、录制视频以及直播服务等相关功能。
								位置权限：用于您开启设备定位功能并同时在发布动态等相关功能。
								手机权限：用于识别您的手机设备、登录等功能。
								存储权限：用于存储您的个人信息、头像、发布内容、图片、视频、意见反馈等功能。
								通知权限：用于给您提供及时的订单信息、活动通知、公告等消息推送功能。
							</p>
							<p>
								我们会收集您的关注、浏览、搜索记录等信息，用于在首页、发现页等信息流界面进行个性化内容推荐。
								我们会收集您的剪切板内容，用于功能相关的必要信息。（如口令）
							</p>
								
						   <p >
							同时会根据平台内写手、橱窗、动态为您推荐相关的优质内容。
							如您需要关闭个性化推荐，您可以随时在【我的】-【隐私设置】-【内容定向推荐】关闭该功能。
							在消息推送时，为了保证消息推送的稳定性，我们会通过系统消息在应用进程被清理时尝试自启动。
						   </p>
							<p >
								我们会通过弹窗向您申请获得授权，您可以随时通过dream约文的功能页面或设备系统设置关闭这些权限。
								除法律另有规定，您有权拒绝我们收集和使用您的个人信息。但请理解，如您拒绝我们收集和使用业务功能所必需的个人信息，则可能无法使用对应的业务功能。
							</p>
							<p >
								 dream约文始终坚持打造满足您的一切文字需求的平台，诚挚地希望您获得良好的约文体验，感谢您的理解与支持。
							</p>       
							 
						</view>
						
					</view>
			
			<view class="contact display-flex" style="margin-top:20rpx;" @tap="makeCallQr">
				同意并继续
			</view>
			<view class="contact display-flex nonono" @tap="makeCall">
				暂不同意
			</view>
			
				<!-- 	<image :src="'/images/close.png' | formatImgUrl" @click="showTip2 = false" class="closepic" mode="">
					</image> -->
				
			</view>
		</view>
		
		
		<view class="mark_msg_bak" v-if="show_msg_tow">
			<view class="mask_msg">
			
					<view class="deal-box">
					
					<view class="conts">
										
						<p >dream约文将采用互联网业内的标准技术措施和数据安全措施保护你的个人信息安全。</p>
						<p >
							如你同意及《dream约文隐私政策》，请选择[同意并继续]进入dream约文并正常使用。你也可以选择[仅浏览]进入浏览模式，但将无法使用发布动态、约文下单、接单、互动、聊天等功能。
						</p>
					</view>
						<!-- <scroll-view class="scroll" scroll-y="true"> -->
						<!-- </scroll-view> -->
					</view>
			
			<view class="contact display-flex" style="margin-top:20rpx;" @tap="makeCallQr">
				同意并继续
			</view>
			<view class="contact display-flex nonono" @tap="makeCallYl">
				仅预览
			</view>
			
				<!-- 	<image :src="'/images/close.png' | formatImgUrl" @click="showTip2 = false" class="closepic" mode="">
					</image> -->
				
			</view>
		</view>
		
	
		
		<!-- <tabbar activeIdx='0'></tabbar> -->

		<!-- <dLoading :status="loading"></dLoading> -->
		
		
		<u-popup mode="bottom" :show="showLogin" @close="showLogin=false">
			<view class="pop-login display-flex">
				<view class="pop-close"  @tap.stop="showLogin=false">
					<image :src="'/images/pop-close.png' | formatImgUrl" class="" mode=""></image>
				</view>
				
				
				<view class="pop-title">
					登录发现遇到灵感
				</view>
				<image :src="'/images/pop-logo.png' | formatImgUrl" class="pop-logo" mode=""></image>
				<view class="pop-btn" @click="showLogin=false,$goLogin('/pages/login/phone')">
					手机号码登录
				</view>
				<view class="pop-btn" @click="showLogin=false,$goLogin('/pages/login/account')">
					账号密码登录
				</view>
				<view class="xiebox" @click="isRead =( isRead == 2?0:2)" :class="isRead == 1 ? 'shake-horizontal' : ''">
					<label>
						<u-checkbox shape="circle" size="14" :checked="isRead" activeColor="#45C4B0" inactiveColor="#999" @change="changeBox"></u-checkbox>
					</label>
					<view class="xietxt">
						我已阅读并同意：<text @click.stop="goToxie">《服务协议》</text>和<text @click.stop="goToOtherxie(14)">《隐私政策》</text>
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>
<script>
	
	import {
		mapState
	} from "vuex";
	import * as db from '@/common/db.js'
	import uniLoadMore from '@/uni_modules/uni-load-more/components/uni-load-more/uni-load-more.vue'
	import {
	  TUIConversationService,
	} from "@tencentcloud/chat-uikit-engine";
	const Screen = uni.requireNativePlugin('Yam-Screen'); //插件	
	export default {
		data() {
			return {
				// 功能列表
				quickList: [{
						id: 1,
						url: '/images/home_like.png',
						title: '发布需求',
						tips: '精准对接',
						click: () => {
							this.xieshou()
						}
					},
					{
						id: 2,
						url: '/images/home_position.png',
						title: '橱窗约文',
						tips: '精准对接',
						click: () => {
							uni.navigateTo({
								url: '/showcase/reserve/list'
							})
						}
					},
					{
						id: 3,
						url: '/images/home_need.png',
						title: '写手约文',
						tips: '精准匹配',
						click: () => {
							uni.navigateTo({
								url: '/showcase/tip/tip'
							})
						}
					},
					{
						id: 4,
						url: '/images/home_writer.png',
						title: '抢单大厅',
						tips: '快速抢单',
						click: () => {
							let auth = db.get('auth');
							if (!auth) {
								// uni.reLaunch({
								// 	url: '/pages/login/login'
								// })
								this.xieshou()
								return;
							}
							
							uni.navigateTo({
								url: '/task/list/user_orderlist'
							})
						}
					},
				],
				// 正在制作列表
				makeList: [],
				is_open: 0,
				show1: false,
				colors: 'rgba(69, 196, 176, 0.1)',
				show: false,
				show_msg:false,
				indexData: {},
				// userInfo: this.$db.get('userInfo'),
				userInfo: {},
				config: this.$db.get('config'),
				// 推荐列表
				navList: [],
				priceList: [{
					id: 1,
					name: '自定义最低价',
				}, {
					id: 2,
					name: '自定义最高'
				}],
				sexList: [{
					id: 1,
					name: '男',
				}, {
					id: 2,
					name: '女'
				}],
				denglist: [{
					id: 1,
					name: '1-10'
				}, {
					id: 2,
					name: '11-20'
				}, {
					id: 3,
					name: '21-30'
				}, {
					id: 4,
					name: '31-40'
				}, {
					id: 5,
					name: '41-50'
				}],
				deng: 0,
				form: {
					sex: '',
					min_price: '',
					max_price: '',
					fengge: '',
					writer_level: ''

				},
				fengge: [],
				list: {},
				writerList: [],
				page: 1,
				ac_info: null,

				make_page: 1,
				is_writer: 0,
				loading: '',
				loadEnd: false,
				status: 'loading',
				noNetwork: false,
				show_msg_tow:false,
				totalPage: true,
				styleMode: 1,
				guessList: [],
				hotList: [],
				wrapList: [],
				viewId: '',
				viewId2: '',
				showLogin: false,
				isRead: false,
				btn_status: ''
			}
		},
		computed: {
			...mapState({
				imNum: state => state.imNum,
			})
		},
		components:{
			uniLoadMore
		},
		onLoad() {
			
			// #ifdef APP-PLUS
			if (plus.os.name == "iOS") {
				Screen.screenshotNotification(res => {
					if (res.detail.code == 200) {
						// 路径
						this.imagePath = res.detail.path
						// base64
						// this.imagePath = res.detail.base64
					}
					uni.showToast({
						title: res.detail.msg,
						icon: 'none',
						duration: 1500
					})
				})
			}
			// #endif
			// this.starUnLP();
			
			if(!this.guessList.length){
				this.getShowcase()
			}
			
			if(!this.writerList.length){
				this.getWriterList()
			}
			
			if(uni.getStorageSync("is_looks")){
				if(uni.getStorageSync("is_looks") > 0){
					
				}else{
					this.show_msg = true
					return
				}
			}else{
				this.show_msg = true
				return;
			}

			if(!this.wrapList.length){
				this.get_data()
			}
			this.getIndex()

	
			// this.getIndex()

			// this.getConfig()
			this.hotList = [];
			this.page = 1;
			this.getMakeList();
		},
		onShow() {
			if(!db.get('auth')){
				this.userInfo = {}
				uni.setStorageSync('loginState','')
			}
			
			if(db.get('auth') && this.userInfo){
				this.getUserInfo()
			}
			
			if(!this.guessList.length){
				this.getShowcase()
			}
			
			if(!this.writerList.length){
				this.getWriterList()
			}
			this.getIndex()
			
			if(!this.wrapList.length){
				this.get_data()
			}
			
			this.getNetworkType()
			this.getAccountState()
		},
		onPullDownRefresh() {
			
			// uni.stopPullDownRefresh(); //停止当前页面下拉刷新	
			// return
			let auth = db.get('auth');
			if (!auth) {
				// uni.navigateTo({
				// 	url: '/pages/login/login'
				// })
				uni.stopPullDownRefresh(); //停止当前页面下拉刷新	
				return;
			}
			
			
			setTimeout(function() {
				uni.stopPullDownRefresh(); //停止当前页面下拉刷新	
			}, 800);
			
			this.getWriterList();
			this.getShowcase()
			
			this.page = 1;
			this.hotList = []
			this.getMakeList();

		},
		// 上拉加载
		onReachBottom() {
			console.log(111);
			this.page++; // 页数加一，加载下一页数据
			this.getMakeList();
		},
		onHide() {
	
			
		},
		// onTabItemTap(e){
			
		// 	if(!db.get('auth')){
		// 		this.showLogin = true
		// 	}
		// },
		methods: {
			starUnLP() {
				//开启防录屏截屏

			
			},
			changeBox(e){
				this.isRead = e ? 2 : 0
			},
			navTap2(id){
				this.$db.set('nav_id',id)
				this.$go('/showcase/reserve/list?id=' + id)
			},
			get_data() {
				let that = this;
				this.$api.default.request('user/get_goods_list_type').then((res) => {
					if (res.code) {
						that.wrapList = res.data
					}
				})
			},
			// 更换样式
			changeMode(){
				this.styleMode = this.styleMode == 1 ? 2 : 1
			},
			switchRoom(){
				let auth = db.get('auth');
				if (!auth) {
					uni.navigateTo({
						url: '/pages/login/login'
					})
					return;
				}
				
				this.$api.default.request('user/qx_new_sys_msg').then((res) => {
					if (res.code) {
						TUIConversationService.switchConversation('C2Csysmsg');
						uni.navigateTo({
							url: '/TUIKit/components/TUIChat/index'
						})
					}
				})
				
				
				
			},
			makeCallYl(){
				this.show_msg_tow = false;
				uni.setStorageSync("is_looks",2)
			},
			yszc(){
				uni.navigateTo({
					url: '/pages/user/abount_dea?id=14' 
				})
			},
			makeCallQr(){
				uni.setStorageSync("is_looks",1)
			
				this.show_msg = false
			
				this.getIndex()
				// this.getConfig()
				this.makeList = [];
				this.page = 1;
				this.getMakeList();
				
				this.getNetworkType()
				this.getAccountState()
			},
			makeCall(){
				this.show_msg = false
				this.show_msg_tow = true;
				
				// console.log(uni.getSystemInfoSync().platform,7777777)
				// if (uni.getSystemInfoSync().platform === 'ios') { 
				// 	plus.runtime.launchApplication({ action: 'QUIT' }); 
				// }else{
				// 	plus.runtime.quit();
				// }
			},
			clickAvatar(){
				
				let auth = db.get('auth');
				if (!auth) {
					// uni.navigateTo({
					// 	url: '/pages/login/login'
					// })
					this.xieshou()
					return;
				}
				
				uni.navigateTo({
					url: '/pages/user/data'
				})
			},
			// 当前账号的冻结信息
			getAccountState(){
				this.$api.default.request('index/getStatus', {
					type: 0,//0冻结动态 1冻结聊天 2冻结橱窗 3抢单权限 4发单权限 5下单权限 6提现权限 7充值权限
				}, 'POST', false).then((res) => {
					if (res.code) {
						console.log(res.is_dong);
					}
				})
				
				let _this = this;
				this.$api.default.request('user/go_list_che',{}, 'POST', false).then((res) => {
					if (res.code) {
						_this.btn_status = res.data;
					}
				})
			},
			getNetworkType() {
			   	uni.getNetworkType({
			   		success:(res) =>{
						if(res.networkType == "none"){
							this.noNetwork = true
							this.$common.errorToShow('您当前处于离线状态')
						}
			   		},
					fail: (err) => {
						console.log(err,111);
					}
			   	});
			},
			goPage(url) {
				return
				if(url){
					uni.navigateTo({
						url: '/pages/webview/webview?url=' + url
					})
				}
			},
			getMakeList() {
				var _this = this;
				this.$api.default.request('good/home_list4', {
					page: this.page
				}, 'POST', false).then((res) => {
					if (res.code) {

						if (res.data.data) {
							if (_this.page != 1) {
								_this.hotList = _this.hotList.concat(res.data.data);
							} else {
								_this.hotList = res.data.data;
							}
							
							setTimeout(()=> {
								_this.totalPage = false
							}, 300);
						}
					}
				})
			},
			handleClick(item) {
				console.log(item,11);
				if (item.id == 4) {
					//获取当前权限
					if (this.is_writer == 0) {
						this.$common.errorToShow('认证写手才可开启抢单权限')
						return;
					}
				}

				if (typeof item.click === 'function') {
					item.click()
				}
			},
			xieshou() {
				
				
				
				if(uni.getStorageSync("is_looks")){
					if(uni.getStorageSync("is_looks") == 1){
						
					}else{
						this.show_msg = true
						return
					}
				}else{
					this.show_msg = true
					return;
				}

				let auth = db.get('auth');
				if (!auth) {
					uni.navigateTo({
						url: '/pages/login/login'
					})
					return;
				}


				// this.$common.errorToShow('暂未开放')
				// return
				if (this.is_open == 1) {
					uni.navigateTo({
						url: '/task/list/orderlist'
					})
				} else {
					uni.navigateTo({
						url: '/task/list/list'
					})
				}
			},
			getConfig() {
				this.$api.default.request('Common/getConfig', {}, 'GET', false).then((res) => {
					if (res.code) {
						this.$db.set('config', res.data)
						this.config = res.data
					}
				})
			},
			screen() {
				this.show = false
				this.getWriterList()
			},
			getWriterList() {
				this.$api.default.request('index/getWriterList4', {
					page: 1
				}, 'POST', false).then((res) => {
					if (res.code) {
						let data = res.data.data
						
						
						var result = [];
						for(var i=0;i<data.length;i+=3){
						    result.push(data.slice(i,i+3));
						}
						this.writerList = result
					}
				}) 
			},
			getShowcase(){
				this.$api.default.request('good/home_list4', {
					page: 1
				}, 'POST', false).then((res) => {
					if (res.code) {
						this.guessList = res.data.data
					}
				}) 
			},
			paiKefu() {
				if (this.config.vip_dispatch_kefu) {
					wx.openCustomerServiceChat({
						extInfo: {
							url: this.config.vip_dispatch_kefu
						},
						corpId: this.config.vip_dispatch_corp_id,
						success(res) {
							console.log(res)
						},
						complete(r) {
							console.log('r', r)
						}
					})
					// uni.navigateTo({
					// 	url: '/pages/webview/webview?url=' + encodeURIComponent(this.config.vip_dispatch_kefu)
					// })
				} else {
					this.$common.errorToShow('客服链接错误，请联系管理员')
				}
			},
			getUserInfo() {
				this.$api.default.request('user/userInfo', {}, 'GET', false).then((res) => {
					if (res.code) {
						uni.setStorageSync('loginState',res.user.membe_id)
						this.userInfo = res.user
					}
				})
			},
			getIndex() {
				
				var _this = this;
				this.$api.default.request('index/index', {}, 'GET', false).then((res) => {
					if (res.code) {

						_this.indexData = res.data
						console.log(res, 666)
						_this.fengge = res.data.tags
						_this.is_open = res.data.is_open
						_this.is_writer = res.data.is_writer

						// this.denglist = res.data.denglist
					}
				})
			},
			open() {
				// console.log('open');
			},
			close() {
				this.show = false
				// console.log('close');
			},
			navTap(item) {
				this.form.sex = item.id
			},
			dengTap(index) {
				this.deng = index
			},
			tagsClick(tagArr, arr) {
				// 选中数据有变化 重新赋值（可以兼容小程序）
				this.denglist = arr;
				// uni.showModal({
				// 	title: '选中的标签',
				// 	content: '选中的标签 = ' + JSON.stringify(tagArr)
				// })
				var ids = "";
				for (var i = 0; i < tagArr.length; i++) {
					var arr = tagArr[i];
					if (i == 0) {
						ids = "" + arr.id;
					} else {
						ids = ids + ',' + arr.id;
					}
				}
				this.form.writer_level = ids

			},
			tagsClick1(tagArr, arr) {
				this.fengge = arr;
				var ids = "";
				for (var i = 0; i < tagArr.length; i++) {
					var arr = tagArr[i];
					if (i == 0) {
						ids = "" + arr.id;
					} else {
						ids = ids + ',' + arr.id;
					}
				}
				this.form.fengge = ids
			},
			tagsClick2(tagArr, arr) {
				this.sexList = arr;
				var ids = "";
				for (var i = 0; i < tagArr.length; i++) {
					var arr = tagArr[i];
					if (i == 0) {
						ids = "" + arr.id;
					} else {
						ids = ids + ',' + arr.id;
					}
				}
				this.form.sex = ids
			}
		}
	}
</script>
<style lang="scss">
	.new-img-box{
		margin: 10px 0;
		
		.img{
			position: relative;
			height: 110px;
			border-radius: 4px;
			
			.s-bg{
				position: absolute;
				top: 0;
				left: 0;
			}
			
			.s-icon{
				position: absolute;
				right: 10px;
				bottom: 10px;
				width: 42px;
				height: 42px;
			}
			
			.txt1{
				position: absolute;
				top: 10px;
				left: 10px;
				font-family: Source Han Sans;
				font-size: 16px;
				font-weight: bold;
				color: #FFFFFF;
				z-index: 11;
			}
			
			.txt2{
				position: absolute;
				top: 35px;
				left: 10px;
				font-family: 思源黑体;
				font-size: 10px;
				letter-spacing: 0.04em;
				color: #FFFFFF;
				z-index: 11;
			}
			
			.txt3{
				position: absolute;
				bottom: 10px;
				left: 10px;
				width: 50px;
				height: 16px;
				z-index: 11;
			}
		}
		
		.img1{
			width: 211px;
			margin-right: 12px;
			background: linear-gradient(118deg, #2BC8AF 33%, #9FF9BD 100%);
			
			.s-bg{
				width: 211px;
				height: 110px;
			}
		}
		
		.img2{
			width: calc(100% - 223px);
			background: linear-gradient(132deg, #53E17E 31%, #BEF693 82%);
			
			.s-bg{
				width: 100%;
				height: 110px;
			}
		}
	}
	
	.quick-new{
		flex-wrap: wrap;
		
		.quick-new-item{
			margin-bottom: 20px;
			width: 25%;
			text-align: center;
			
			image{
				width: 24px;
				height: 24px;
			}
			
			view{
				margin-top: 6px;
				font-family: Source Han Sans;
				font-size: 10px;
				color: #3D3D3D;
			}
		}
	}
	
	.guess_warp{
		.item{
			margin-right: 12px;
		}
		
		.top-img{
			width: 100px;
			height: 59px;
			position: relative;
			
			view{
				position: absolute;
				top: 0px;
				left: 0px;
				width: 100px;
				height: 59px;
				background: linear-gradient(0deg, #333333 0%, rgba(0, 0, 0, 0) 100%);
				border-radius: 8px;
				
			}
			
			text{
				position: absolute;
				right: 6px;
				bottom: 4px;
				font-size: 8px;
				color: #fff;
			}
		}
		
		image{
			width: 100px;
			height: 59px;
			border-radius: 8px;
		}
		
		.tit{
			width: 100px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-family: Microsoft YaHei;
			font-size: 12px;
			color: #3D3D3D;
			margin-top: 3px;
			margin-bottom: 2px;
		}
		
		.desc{
			width: 100%;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-family: 思源黑体;
			font-size: 10px;
			color: #999999;
		}
	}
	
	.writer_warp{
		display: flex;
		align-items: center;
		height: 190px;
		margin-top: 12px;
		
		.item{
			
			margin-right: 24px;
			margin-bottom: 20px;
		}
		
		image{
			width: 40px;
			height: 40px;
			border-radius: 4px;
			margin-right: 8px;
		}
		
		.tit{
			width: 65px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-family: Microsoft YaHei;
			font-size: 12px;
			color: #3D3D3D;
			margin-bottom: 8px;
		}
		
		.desc{
			width: 65px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-family: 思源黑体;
			font-size: 10px;
			color: #999999;
			
			text{
				font-family: 思源黑体;
				font-size: 12px;
				font-weight: bold;
				color: #45C4B0;
			}
		}
	}
	
	.show-wrap{
		margin-top: 16px;
		
		.item{
			width: 100%;
			margin-bottom: 12px;
		}
		
		.txt1{
			max-width: 80%;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-family: 思源黑体;
			font-size: 14px;
			font-weight: bold;
			color: #3D3D3D;
		}
		
		.tag{
			margin-left: 4px;
			padding: 1px 4px;
			background: rgba(69, 196, 176, 0.15);
			border-radius: 4px;
			font-family: 思源黑体;
			font-size: 10px;
			color: #45C4B0;
		}
		
		.desc{
			margin-top: 4px;
			margin-bottom: 8px;
			font-family: 思源黑体;
			font-size: 10px;
			color: #999999;
			display: -webkit-box;
			overflow: hidden;
			text-overflow: ellipsis;
			word-break: break-all;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
		}
		
		.stars{
			image{
				width: 13px;
				height: 13px;
				margin-right: 2px;
			}
			
			text{
				font-family: 思源黑体;
				font-size: 12px;
				font-weight: bold;
				color: #45C4B0;
			}
		}
		
		.count{
			font-family: 思源黑体;
			font-size: 10px;
			font-weight: 300;
			color: #999999;
		}
		
		.price{
			margin-left: 4px;
			font-family: 思源黑体;
			font-size: 12px;
			font-weight: bold;
			color: #45C4B0;
		}
		
		.pics{
			margin-top: 11px;
			
			image{
				margin-right: 12px;
				width: 80px;
				height: 80px;
				border-radius: 4px;
				
				&:nth-of-type(4n){
					margin-right: 0;
				}
			}
		}
	}
	
	.show-wrap2{
		margin-top: 16px;
		align-items: flex-start;
		flex-wrap: wrap;
		justify-content: space-between;
		
		.item{
			width: 162px;
			margin-bottom: 12px;
		}
		
		.tit{
			display: -webkit-box;
			overflow: hidden;
			text-overflow: ellipsis;
			word-break: break-all;
			-webkit-line-clamp: 1;
			-webkit-box-orient: vertical;
			font-family: 思源黑体;
			font-size: 14px;
			font-weight: bold;
			color: #3D3D3D;
		}
		
		.desc{
			/* #ifdef APP */
			height: 90rpx;
			/* #endif */
			/* #ifndef APP */
			height: 80rpx;
			/* #endif */
			display: -webkit-box;
			overflow: hidden;
			text-overflow: ellipsis;
			word-break: break-all;
			-webkit-line-clamp: 3;
			-webkit-box-orient: vertical;
			font-family: 思源黑体;
			font-size: 10px;
			color: #999999;
			margin-top: 8px;
			margin-bottom: 22px;
		}
		
		.infos{
			display: flex;
			align-items: center;
			justify-content: flex-end;
			margin-bottom: 9px;
		}
		
		.count{
			font-family: 思源黑体;
			font-size: 10px;
			font-weight: 300;
			color: #999999;
		}
		
		.price{
			margin-left: 4px;
			font-family: 思源黑体;
			font-size: 12px;
			font-weight: bold;
			color: #45C4B0;
		}
		
		.tag{
			padding: 1px 4px;
			background: rgba(69, 196, 176, 0.15);
			border-radius: 4px;
			font-family: 思源黑体;
			font-size: 10px;
			color: #45C4B0;
		}
		
		.stars{
			image{
				width: 13px;
				height: 13px;
				margin-right: 2px;
			}
			
			text{
				font-family: 思源黑体;
				font-size: 12px;
				font-weight: bold;
				color: #45C4B0;
			}
		}
	}
	
	.content {
		
		.mark_msg_bak{
			background: rgba(0,0,0,0.8);
			width: 100%;
			height: 100%;
			position: fixed;
			top:0px;
			left:0px;
			z-index:999999;
			margin: 0 auto;
		}
		
		.mask_msg{
			z-index:9999999;
			width: 534rpx;
			margin: 0 auto;
			margin-top: 60%;	
			height: 600rpx;
			border-radius: 0.3em;
			background: #fff !important;
			.deal-box {
				padding-top: 30rpx;
				width: 87%;
				// margin-left: 5%;
				padding-left: 7%;
				padding-right: 5%;
				border-radius: 0.3em;
				background-color: #fff;
				height:340rpx;
				font-size: 24rpx;
			}

			.tit {
				text-align: center;
				font-family: '思源黑体';
				font-size: 30rpx;
				font-weight: bold;
				color: #3D3D3D;
				padding-bottom: 10rpx;
			}

			.sub-tit {
				margin-top: 4px;
				margin-bottom: 12px;
				font-family: '思源黑体';
				font-size: 12px;
				color: #ED3232;
			}
			textarea{
				font-size: 22rpx;
				width: 100%;
				color: #000;
				margin-top: 10rpx;
				margin-bottom: 30rpx;
			}
			
			
			.conts{
				height: 300rpx;
				overflow:scroll;
				font-size: 22rpx;
				width: 100%;
				color: #000;
				margin-top: 10rpx;
				margin-bottom: 30rpx;
				p{
					text-indent: 2em;
					margin-top: 15rpx;
					span{
						color:#45c4b0
					}
				}
			}
			.scroll {
				font-family: 'Source Han Sans';
				font-size: 10px;
				color: #3D3D3D;

				view {
					font-size: 12px;
					font-weight: bold;
					margin-bottom: 10px;
				}
			
			}

			.border {
				width: 100%;
				height: 1px;
				background: rgba(153, 153, 153, 0.1);
				margin: 20px 0;
			}

			.contact {
				width: 227px;
				height: 33px;
				border-radius: 8px;
				background: #45C4B0;
				justify-content: center;
				font-family: 'Source Han Sans';
				font-size: 14px;
				font-weight: bold;
				color: #FFFFFF;
				margin: 0 auto;
				margin-top: 40rpx !important;
			}
			
			.nonono{
				background: #fff;
				color: #999999;
				font-weight: 500;
				margin-top: 10rpx;
				height: 13px !important;
			}

			.closepic {
				display: block;
				margin: 0 auto;
				margin-top: 22px;
				width: 20px;
				height: 20px;

			}
		}
	
		.emptyImg_home {
			width: 100%;
			text-align: center;

			image {
				width: 378rpx;
				height: 132rpx;
				margin: 0 auto;
			}
		}

		.jipic {
			width: 41px;
			height:19px;
			position: relative;
			left: 10rpx;
			top: 10rpx
			image {
				width: 41px !important;
				height: 19px !important;
			}
			img{
				width: 41px !important;
				height: 19px !important;
			}
		}

		// 快捷功能区
		.quick_list {
			width: 100%;
			margin: 30rpx 0 40rpx;
			display: flex;
			justify-content: space-around;
			align-items: center;

			.item {
				display: flex;
				justify-content: center;
				flex-direction: column;
				align-items: center;
				position: relative;

				img {
					width: 52rpx;
					height: 52rpx;
					object-fit: cover;
					position: relative;
					z-index: 2;
					border: 1rpx dashed #eee;
				}
				image {
					width: 52rpx;
					height: 52rpx;
					object-fit: cover;
					position: relative;
					z-index: 2;
					border: 1rpx dashed #eee;
				}

				.item-bg {
					width: 114rpx;
					height: 38rpx;
					border-radius: 196rpx;
					background: #E3F6F3;
					position: absolute;
					z-index: 1;
					top: 22rpx;
				}

				.title {
					font-size: 28rpx;
					font-weight: bold;
					color: #333333;
					margin-top: 8rpx;
				}

				.info {
					font-size: 20rpx;
					color: #999999
				}

			}

		}

		// 首页Tips
		.home_tip {
			display: flex;
			align-items: center;
			padding: 12rpx 24rpx;
			margin-bottom: 40rpx;
			background: rgba(69, 196, 176, 0.07);
			border-radius: 8rpx;

			.tip {
				font-size: 20rpx;
				font-weight: bold;
				color: #45C4B0;
				display: flex;
				align-items: center;

				.tip_img {
					width: 28rpx;
					height: 30rpx;
					object-fit: cover;
					margin-right: 8rpx;
				}
			}

			.text {
				font-size: 20rpx;
				color: #45C4B0;
				margin-left: 8rpx;
			}
		}

		.more {
			font-size: 20rpx;
			color: #999999;
			
			image{
				width: 14px;
				height: 14px;
				margin-right: 4px;
			}
		}

		// 正在制作
		.make_slider {
			margin-top: 4px;
			
			.header {
				display: flex;
				justify-content: space-between;
				align-items: flex-end;
				margin-bottom: 16px;

				.title {
					font-size: 32rpx;
					font-weight: bold;
					color: #3D3D3D;
				}
			}

			.make_warp {
				display: flex;

				.item {
					width: 378rpx;
					height: 132rpx;
					box-sizing: border-box;
					padding: 20rpx;
					border-radius: 8rpx;
					margin-right: 20rpx;
					border: 1rpx solid rgba(216, 216, 216, 0.3);

					.header {
						font-size: 24rpx;
						font-weight: bold;
						color: #3D3D3D;
					}

					.info {
						display: flex;
						justify-content: space-between;
						align-items: center;
						margin-top: 24rpx;

						.text {
							font-size: 24rpx;
							color: #999999;
						}

						.operate {
							padding: 0 15rpx;
							height: 40rpx;
							border-radius: 188rpx;
							font-size: 20rpx;
							text-align: center;
							line-height: 40rpx;
							color: #45C4B0;
							background: rgba(69, 196, 176, 0.15);
						}
					}
				}
			}

		}

		.cl1 {
			height: 70rpx;
			width: 70rpx;
			;
			position: relative;
			top: 120rpx;
		}

		.zhezhao {
			height: 100vh;
			position: fixed;
			top: 0rpx;
			right: 0px;
			width: 100%;
			z-index: 101;
			background: rgba(51, 51, 51, 0.6);
		}

		.biaoqian {
			position: fixed;
			float: left;
			top: 18%;
			z-index: 102;
			border-radius: 0.5em;
			background: #fff;
			width: 80%;
			margin-left: 5%;
			text-align: center;

			.top {
				padding-top: 60rpx;
				font-size: 36rpx;
				color: #000;
				float: left;
				text-align: center;
				width: 80%;
				margin-left: 10%;
			}

			.tab {
				padding-top: 28rpx;
				font-size: 25rpx;
				font-weight: 700;
				width: 90%;
				margin-left: 5%;
				float: left;
				text-align: center;

				view {
					background: rgba(153, 153, 153, 0.2);
					padding: 2rpx 20rpx 2rpx 20rpx;
					margin-left: 16rpx;
					border-radius: 0.5em;
					text-align: center;
					float: left;
				}
			}

			.not_like {
				width: 100%;
				text-align: center;
				float: left;
				color: #999;
				font-size: 27rpx;
				margin-top: 40rpx;
			}

			.line {
				margin-top: 30rpx;
				width: 88%;
				margin-left: 6%;
				float: left;
				height: 0px;
				opacity: 1;
				border: 1rpx solid rgba(153, 153, 153, 0.1);
			}

			.cont_t {
				border-radius: 8px;
				opacity: 1;
				background: rgba(69, 196, 176, 0.05);
				float: left;
				width: 88%;
				height: 86rpx;
				margin-left: 6%;
				text-align: center;
				margin-top: 30rpx;
				color: #45C4B0;

				.t1 {
					width: 50%;
					margin: 0 auto;
					margin-top: 20rpx;

					image {
						width: 43rpx;
						;
						height: 43rpx;
						float: left;
					}

					.tex {
						float: left;
						margin-left: 10rpx;
					}
				}
			}

			.cont_b {
				float: left;
				width: 100%;
				text-align: center;
				margin-top: 20rpx;
				background: rgba(69, 196, 176, 0.05);
				float: left;
				width: 88%;
				height: 86rpx;
				margin-left: 6%;
				color: #45C4B0;

				.t1 {
					width: 50%;
					margin: 0 auto;
					margin-top: 20rpx;

					image {
						width: 43rpx;
						;
						height: 43rpx;
						float: left;
					}

					.tex {
						float: left;
						margin-left: 10rpx;
					}
				}
			}
		}


		padding: 20rpx 30rpx;

		.serbox {
			display: flex;
			align-items: center;
			background: #F8F8F8;
			border-radius: 142px;
			height: 72rpx;
			padding: 0 26.66rpx;
			margin-bottom: 20rpx;

			.serpic {
				width: 32rpx;
				height: 32rpx;
				flex-shrink: 0;
			}

			.serput {
				padding: 0 16rpx;
				width: 500rpx;
				font-size: 28rpx;
				color: #333333;
			}
		}

		.swiper {
			width: 100% !important;
			height: 240rpx !important;
			position: relative;
			border-radius: 8px;
			margin-bottom: 20rpx;

			.swiperwra {
				border-radius: 16rpx;

				.imgass {
					width: 100% !important;
					height: 240rpx !important;
				}
			}

		}

		.pibox {
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-radius: 8px;
			height: 100rpx;
			padding: 0 20rpx;
			background: rgba(69, 196, 176, 0.1);
			margin-bottom: 20rpx;

			.pipic {
				width: 58rpx;
				height: 60rpx;
				flex-shrink: 0;
			}

			.picen {
				padding: 0 20rpx;
				flex-grow: 1;

				.pititle {
					font-size: 28rpx;
					font-weight: bold;
					color: #45C4B0;
					padding-bottom: 5rpx;
				}

				.pitxt {
					font-size: 20rpx;
					color: #999999;
				}
			}

			.piyou {
				width: 152rpx;
				height: 60rpx;
				border-radius: 142px;
				text-align: center;
				line-height: 60rpx;
				background: #45C4B0;
				font-size: 28rpx;
				color: #ffffff;
			}
		}

		.tuibox {
			margin-top: 24px;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.tuititle {
				font-size: 32rpx;
				font-weight: bold;
				color: #3D3D3D;
			}

			.tuiyou {
				display: flex;
				align-items: center;
				justify-content: flex-end;

				.tuipic {
					width: 34rpx;
					height: 32rpx;
				}

				.tuitxt {
					font-size: 28rpx;
					color: #999999;
					padding-left: 10rpx;
				}
			}
		}

		.yaobox {
			padding: 20rpx 0;
			border-bottom: 1px solid rgba(153, 153, 153, 0.1);
			display: flex;
			align-items: center;

			.yaopic {
				width: 78rpx;
				height: 78rpx;
				border-radius: 50em;
				flex-shrink: 0;
			}

			.yaoyou {
				padding: 0 20rpx;
				width: 100%;

				.yaotitle {
					font-size: 28rpx;
					color: #3D3D3D;
				
					display: flex;
					align-items: center;

					.jipic {
						position: inherit !important;
					}

					.evaluate {
						width: 100rpx;
						height: 32rpx;
						border-radius: 8rpx;
						padding: 2rpx 8rpx;
						background: rgba(69, 196, 176, 0.15);
						font-size: 20rpx;
						line-height: 32rpx;
						color: #45C4B0;
						text-align: center;
						margin-left: auto;
					}
				}


				.qianbox {
					white-space: nowrap;
					padding-bottom: 16rpx;

					.qli {
						// background: rgba(153, 153, 153, 0.1);
						padding: 3rpx 12rpx 4rpx 8rpx;
						border-radius: 178px;
						font-size: 24rpx;
						color: #3D3D3D;
						margin-right: 16rpx;
						display: inline-block;
					}
				}

				.zibox {
					display: flex;
					align-items: center;
					justify-content: space-between;

					.zititle {
						font-size: 32rpx;
						font-weight: bold;
						color: #45C4B0;

						text {
							padding-left: 8rpx;
							font-size: 20rpx;
							color: #999999;
						}
					}

					.zitxt {
						font-size: 20rpx;
						color: #999999;
					}
				}
			}
		}

		.mask {
			background-color: #F2F5F2;
			border-radius: 8px 8px 0 0;

			.matop {
				background-color: #ffffff;
				margin-bottom: 20rpx;
				padding: 40rpx 30rpx 28rpx;

				.matitle {
					line-height: 40rpx;
					font-size: 28rpx;
					font-weight: bold;
					text-align: center;
					letter-spacing: 0em;
					color: #3D3D3D;
					padding-bottom: 20rpx;
				}

				.bietxt {
					padding-bottom: 8rpx;
					line-height: 40rpx;
					font-size: 28rpx;
					font-weight: bold;
				}

				.geetxt {
					padding-bottom: 8rpx;
					padding-top: 16rpx;
					line-height: 40rpx;
					font-size: 28rpx;
					font-weight: bold;
				}

				.gebox {
					display: flex;
					align-items: center;
					justify-content: space-between;

					.geli {
						width: 326rpx;
						height: 52rpx;
						overflow: hidden;
						border-radius: 178rpx;
						opacity: 1;
						background: rgba(153, 153, 153, 0.1);
						font-size: 22rpx;
						font-weight: normal;
						text-align: center;
						letter-spacing: 0em;
						color: #999999;
						margin-bottom: 12rpx;
					}

					.li72 {
						line-height: 72rpx;
					}

					.active {
						background: rgba(69, 196, 176, 0.1);
						color: #45C4B0;
					}
				}

			}

			.madi {
				width: 100%;
				height: 120rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				opacity: 1;

				background: #FFFFFF;

				.masub {
					width: 630rpx;
					height: 80rpx;
					border-radius: 8px;
					opacity: 1;
					background: #45C4B0;
					font-size: 32rpx;
					font-weight: bold;
					text-align: center;
					letter-spacing: 0em;
					color: #FFFFFF;
					line-height: 80rpx;
				}
			}
		}
		
		
		.mask_msg {
			background-color: #F2F5F2;
			border-radius:0.5em;
		
		}

		.u-popup__content.data-v-52d4ddd1 {
			border-radius: 8px 8px 0 0;
			overflow: hidden;
		}

		.cencal_order {
			padding: 20upx 4%;
			background-color: #fff;
		}

		.remark {
			background-color: #F5F5F5;
			border-radius: 10upx;
			height: 40vw;
			padding: 20upx;
			margin-top: 20upx;

			textarea {
				font-size: 26upx;
				color: #797979;
			}
		}

		.textarea_p {
			font-size: 24upx;
			color: #797979;
		}

		.btns {
			width: 100%;
			height: 80upx;
			line-height: 80upx;
			font-size: 30upx;
			color: #333;
			text-align: center;
			margin-top: 100upx;
			border-radius: 8upx;
		}
	}
</style>